<div id="sltjcont">
    <div class="panel panel-default sjzsdata">
        <div class="panel-heading">
            <h3 class="panel-title">数量统计</h3>
        </div>
        <div class="panel-body">
            <div>
                <form class="bs-example bs-example-form row" role="form">
                        <div class="form-group col-lg-2 col-lg-offset-5">
                            <select class="form-control col-lg-10">
                                <option>选择要查询的年份</option>
                                <option>2017</option>
                                <option>2016</option>
                                <option>2015</option>
                            </select>
                        </div>
                </form>
            </div>
        </div>
        <table class="table sltj">
            <tr>
                <td><h5>2016年业务数量统计</h5></td>
            </tr>
            <tr>
                <td>
                    <div id="main" class="col-lg-12">

                    </div>
                </td>
            </tr>
        </table>
    </div>
</div>
<script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));
    // 显示标题，图例和空的坐标轴
    myChart.setOption({
        title: {
            text: ''
        },
        tooltip: {},
        legend: {
            data:[]
        },
        xAxis: {
            data: []
        },
        yAxis: {},
        series: [{
            name: '销量',
            type: 'bar',
            data: []
        }]
    });
    myChart.showLoading();
    // 异步加载数据
    $.get('../json/home.json').done(function (dat) {

        myChart.hideLoading();
        // 填入数据
        var data=dat.comData;
        myChart.setOption({
            xAxis: {
                data: data.categories
            },
            series: [{
                // 根据名字对应到相应的系列
                name: '销量',
                data: data.data,
                itemStyle: {
                    normal: {
                        color: function (params) {
                            // build a color map as your need.
                            var colorList = [
                                '#7adddd', '#6e84bd', '#db5846', '#6e84bd', '#db5846',
                                '#7adddd', '#db5846', '#db5846', '#6e84bd', '#7adddd',
                                '#7adddd', '#6e84bd', '#F4E001', '#F0805A', '#26C0C0'
                            ];
                            return colorList[params.dataIndex]
                        },
                        label: {
                            show: true,
                            position: 'top',
                            formatter: '{b}\n{c}'
                        }
                    }
                }
            }]
        });
    });
</script>